<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /* 
            var arr = [1,2,3,4]
            对这个数组进行循环
                [1,2,3,4]
                    循环第一个 i = 0; 0 < 4 ; => 执行删除下标为0的那个元素 =>结果[2,3,4]
                [2,3,4]
                    循环第二次 i = 1; 1 < 3 ; => 执行删除下标为1的那个元素 =>结果[2,4]
                [2,4]
                    循环第三次 i = 2; 2 < 2
                        循环结束
                
            像这种情况,我们管他叫做数组塌陷,由于将前面的元素给删除了,所以后面的元素挤上来了,造成了数组塌陷
                数组塌陷的解决方案:
                    方案1:   倒循环,从后面开始遍历,从后面进行删除,就不会有元素从后面往前面挤,那就不会造成数组塌陷
                    ```for(var i = arr.length - 1; i >= 0; i--){
                        arr.splice(i,1)
                    ```}

                    方案1:
                    [1,2,3,4] => 干掉下标为0    => [2,3,4]
                    [2,3,4]   => 干掉下标为0    => [3,4]
                    [3,4]     => 干掉下标为0    => [4]
                    [4]       => 干掉下标为0    => []
                    ```
                    [1,2,3,4]   => i = 0; 0 < 4 ; => 干掉下标为0的那个元素 => i = -1 => [2,3,4] 
                    [2,3,4]     => i = 0; 0 < 3 ; => 干掉下标为0的那个元素 => i = -1 => [3,4]
                    [3,4]       => i = 0; 0 < 2 ; => 干掉下标为0的那个元素 => i = -1 => [4]
                    [4]         => i = 0; 0 < 1 ; => 干掉下标为0的那个元素 => i = -1 => []
                    []          => i = 0; 0 < 0 循环结束
                    
                    for(var i = 0 ; i < arr.length ; i++){
                        arr.splice(i,1)
                        i--
                    }
                    ```

        */
        /* 
            数组塌陷的解决方案二
        */
        // var arr = [1, 2, 3, 4]
        // for(var i = 0 ; i < arr.length ; i++){
        //     //删除数组中下标为i的那个元素,删除的长度为1
        //     arr.splice(i,1)
        //     //解决数组塌陷
        //     i--;
        // }
        // console.log(arr);







        /* 
            数组的塌陷解决方案一,使用倒循环
        */
        // var arr = [1, 2, 3, 4]
        // //使用倒循环干掉每一个元素 
        // for (var i = arr.length - 1; i >= 0; i--) {
        //     arr.splice(i, 1)
        // }
        // console.log(arr);






        /*
            演示数组塌陷
        */
        //定义一个数组
        // var arr = [1,2,3,4]
        //将数组里面的每一个元素都删除
        // for(var i = 0 ; i < arr.length ; i++){
        //     arr.splice(i,1)
        // }
        //结果 [] ,[1,2,3] , [2,3,4] , [1,2,3,4]
        // console.log(arr);
    </script>
</body>

</html>